<template>
  <div class="pay-message">
    <h3>订单留言</h3>
    <div class="pay-message-all">
      <div class="pay-msg-text">
        <textarea class="pay-input" type="text" placeholder="限300字(如有特殊需求，请联系商城在线客服)">
        </textarea>
        <div class="pay-msg-info">
          <p>商品总金额：¥1098</p>
          <p>运费：0.00</p>
          <p>优惠：¥0.00</p>
          <p>赠送积分：1098</p>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
export default {

}
</script>

<style lang="less">
  .pay-message{
    width: 100%;
    margin-bottom: 1.2rem;
    background: white;
    h3{
      border-top: .2rem solid #F4F4F4;
      line-height: 1.2rem;
      border-bottom: 1px solid #eee;
      padding-left: .42rem;
      font-size: .42rem;
    }
    .pay-message-all{
      width: 100%;
      margin: 0 auto;
      .pay-msg-text{
        width: 91%;
        margin: 0 auto;
        .pay-input{
          width: 100%;
          height: 2.4rem;
          margin-top: 0.2rem;
          border: 1px solid #ccc;
          border-radius: 0.1rem;
          font-size: .42rem;
          padding: .2rem;
        }
        .pay-msg-info{
          width: 100%;
          margin-top: .5rem;
          padding-bottom: .3rem;
          p{
            color: #888;
            font-size: 0.36rem;
            line-height: 0.5rem;
          }
        }
      }
    }
  }
</style>
